<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>果蔬农场</title>

    <meta name="description" content="Dashboard">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--Basic Styles-->
    <link href="__admin__/style/bootstrap.css" rel="stylesheet">
    <link href="__admin__/style/font-awesome.css" rel="stylesheet">
    <link href="__admin__/style/weather-icons.css" rel="stylesheet">

    <!--Beyond styles-->
    <link id="beyond-link" href="__admin__/style/beyond.css" rel="stylesheet" type="text/css">
    <link href="__admin__/style/demo.css" rel="stylesheet">
    <link href="__admin__/style/typicons.css" rel="stylesheet">
    <link href="__admin__/style/animate.css" rel="stylesheet">
    <style>
        /* .divddq {
      
        /* ----------- */
        .proportion {
            width: 50%;
            height: 630px;
            background-color: rgb(255, 255, 255);
        }
        .xiao {
            display: flex;
        }
        .ddq {
            width: 50%;
            height: 150px;
            background-color:  #5BB3A7;
            text-align: center;
            padding-top: 3%;
            color: rgb(255, 255, 255);
            margin: 5px;
        }
        .ddq .aa {
            font-size: 28px;
        }
        .ddq:first-child {
            background-color: #CB9358;
            margin-right: 5px;
        }
        .yx {
            width: 99%;
            height: 30px;
            background-color:  #2DC3E8;
            color: #ffffff;
            font-size: 18px;
            font-weight: 500;
            line-height: 30px;
            padding-left: 20px;
            display: flex;
            margin: 3px auto;
            overflow: hidden;
        }
        .yxdz {
            width: 98%;
            height: 30px;
            background-color:  #2DC3E8;
            color: #ffffff;
            font-size: 18px;
            font-weight: 500;
            line-height: 30px;
            padding-left: 20px;
            display: flex;
            margin: 3px auto;
            overflow: hidden;
            margin-left: 5px;
        }
        
        .yx .su {
            width: 8px;
            height: 20px;
            background-color: rgb(255, 255, 255);
            margin: 5px;
            border-radius: 5px;
        }
        .yxdz .su {
            width: 8px;
            height: 20px;
            background-color: rgb(255, 255, 255);
            margin: 5px;
            border-radius: 5px;
        }

        .proportion-rig {
            width: 49%;
            height: 630px;
            margin-left: 10px;
            background-color: rgb(255, 255, 255);
        }
        .page-body {
            display: flex;
            flex-wrap: wrap;
        }
        #rowl {
            padding-left: 120px;
        }

        .box1 {
           width: 38%;
           background-color: rgb(255, 255, 255);
           margin-top: 10px;
        }
        .box2 {
            width: 36%;
            background-color: rgb(255, 255, 255);
            margin-left: 10px;
            margin-top: 10px;
           
        }
        .box3 {
            width: 25%;
            background-color: rgb(255, 255, 255);
            margin-top: 10px;
           
        }
        .divleft {
            width: 100%;
            height: 900px;
            margin-top: 10px;
            background-color: rgb(255, 255, 255);
        }
        .divrig {
            position: relative;
            right: 0;
            margin-top: 10px;
            margin-left: 10px;
            height: 890px;
            background-color: rgb(255, 255, 255);
        }
        .divrig2 {
            position: relative;
            right: 0;
            margin-top: 10px;
            width: 24%;
            height: 890px;
            background-color: rgb(255, 255, 255);
        }
        #main5 {
            padding-right: 180px;
        }
        #main7 {
            padding-right: 180px;
        }


        .body2 {
            width: 100%;
            height: 1000px;
            /* margin: 10px; */
            margin-top: 10px;
            margin-right: 5px;
            background-color: rgb(255, 255, 255);
        }
        .zhong {
            padding: 90px;
        }
        #main14 {
            /* padding-left: 100px; */
            padding-top: 15px;

        }
        #main13 {
           margin: 90px;
        }
        .pai {
            width: 100%;
            height: 100px;
            background-color: crimson;
        }
        .aa {
            margin-top: 10px;
        }
        .rigpn {
            width: 100%;
            height: 398px;
            /* background-color: crimson; */
        }
        .rigpn .nr{
            width: 100%;
            height: 38px;
            font-size: 20px;
            /* background-color: #CB9358; */
            border: 1px solid #cccccc;
            line-height: 40px;
            padding-left: 20px;
            margin-top: 5px;
            border-radius: 10px
        }
        .rigpn2 .nr{
            width: 100%;
            height: 100px;
            border-radius: 10px;
            background-color:  #ffffff;
            border: 1px solid #ccc;
            margin-top: 10px;
            padding: 10px;
            text-align: center;
            padding-top: 25px;
        }
        .rigpn2 .nr .ntbt {
            font-size: 12px;
        }
        .rigpn2 .nr .nrkx {
            font-size: 25px;
        }

        .navbar {
            position: fixed;
            width: 100%;
        }
        .page-sidebar {
            position: fixed;
        }
    </style>
</head>

<body>
    <!-- 头部 -->
    {include file="common/head"}
    <!-- /头部 -->

    <div class="main-container container-fluid">
        <div class="page-container">
            <!-- Page Sidebar -->
            {{include file="common/left"}}
            <!-- /Page Sidebar -->
            
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb">
                        <li>
                            <a href="#">系统</a>
                        </li>
                        <li class="active">数据分析</li>
                    </ul>
                </div>
                <!-- /Page Breadcrumb -->

                <!--数据分析 Page Body -->
                <div class="page-body">

                    <div class="proportion">
                        <div class="xiao">
                            <div class="ddq">
                                <svg t="1605324438933" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8977" width="32" height="32"><path d="M1014.912 960.568H63.432V262.816H0V1024h1014.912z" fill="#ffffff" p-id="8978"></path><path d="M824.624 453.112L634.32 611.696 348.88 326.248 126.864 611.696v285.44h824.616z" fill="#ffffff" p-id="8979"></path></svg>
                                <div>全国粮食播种面积</div>
                                <div class="aa">16.5亿亩</div>
                            </div>
                            <div class="ddq">
                                <svg t="1605322418898" class="icon" viewBox="0 0 1256 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7539" width="32" height="32"><path d="M402.15387 887.880341c0-76.110762-58.673621-135.334203-134.077472-135.334203-75.403851 0-133.998926 59.223441-133.998926 135.334203 0 76.189307 58.595076 135.334203 133.998926 135.334202s134.077472-67.627828 134.077472-135.334202z m670.230267 0c0-76.110762-58.595076-135.334203-133.998926-135.334203s-134.077472 59.223441-134.077471 135.334203c0 76.189307 58.673621 135.334203 134.077471 135.334202 75.403851 0 133.998926-67.627828 133.998926-135.334202z m0-685.153947C1089.192912 84.358058 980.250058 67.392191 980.250058 67.392191c-25.134617-16.887321-175.942318 0-175.942318 0-100.538467-143.73859-175.942318 0-175.942319 0H494.28795C410.558257 25.134617 452.423103 160.46882 452.423103 160.46882H360.289024c-67.078009-42.33612-134.077472 42.257575-134.077472 42.257574-16.730229-76.110762-41.864846 0-41.864846 0-125.673084-16.887321-175.942318 93.076628-175.942318 93.076628h1206.461609c16.730229-143.817136-142.481859-93.076628-142.48186-93.076628z" fill="#ffffff" p-id="7540"></path><path d="M117.268697 794.882258A179.319782 179.319782 0 0 1 276.480785 701.80563c100.538467 0 175.942318 84.593695 175.942318 177.670323h310.01979a177.827414 177.827414 0 0 1 175.942318-177.670323c66.999463 0 117.268697 33.774641 150.807701 84.593695l75.403851-448.338728H0l117.268697 456.821661z m360.289023-33.853187l-41.864846-42.33612L628.365421 524.213853l100.538468 101.481015 192.672547-169.187389-41.864846-42.257575 125.673084 8.404388v126.929815l-41.864846-42.336121L728.903889 701.80563 628.365421 600.324615 477.55772 761.029071z" fill="#ffffff" p-id="7541"></path></svg>
                                <div>全国粮食产量</div>
                                <div class="aa">1.2万亿斤</div>
                            </div>
                        </div>
                        <div class="yx"><div class="su"></div> 2020年全国农用地利用情况</div>
                        <div class="rowl">
                            <div id="main" style="width: 600px;height:400px;"></div>
                        </div>
                    </div>

                    <div class="proportion-rig">
                        <div class="xiao">
                            <div class="ddq">
                                <svg t="1605335040980" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11393" width="32" height="32"><path d="M575.5 26.2l267.1 265.1c35.1 34.8 35.1 91.4 0 126.3L575.5 682.7c-35.1 34.8-92.1 34.8-127.2 0L181.2 417.6c-35.1-34.8-35.1-91.4 0-126.3L448.3 26.2c35.1-34.8 92.1-34.8 127.2 0z" fill="#ffffff" p-id="11394"></path><path d="M575.5 682.7c-17.6 17.5-40.6 26.1-63.7 26.1V0c23.1 0 46 8.7 63.7 26.1l267.1 265.1c35.1 34.8 35.1 91.4 0 126.3L575.5 682.7z" fill="#ffffff" p-id="11395"></path><path d="M176 367h663.4c49.5 0 89.6 39.8 89.6 88.8 0 0 17.9 154.8 17.9 284.1 0 81.2-17.9 159.7-17.9 159.7 0 49.1-40.2 88.8-89.6 88.8 0 0-161.1 35.5-322.7 35.5-169.8 0-340.7-35.5-340.7-35.5-49.5 0-89.6-39.8-89.6-88.8 0 0-17.9-71.1-17.9-159.7 0-126.4 17.9-284.1 17.9-284.1 0-49 40.1-88.8 89.6-88.8z" fill="#ffffff" p-id="11396"></path><path d="M839.4 988.5S678.3 1024 516.7 1024H512V367h327.4c49.5 0 89.6 39.8 89.6 88.8 0 0 17.9 154.8 17.9 284.1 0 81.2-17.9 159.7-17.9 159.7 0 49.1-40.1 88.9-89.6 88.9z" fill="#ffffff" p-id="11397"></path><path d="M408.8 877.4c-35.4-20.8-45.2-70.8-41-78.3 4.4-7.7 51.8-23.9 87.2-3.1s50.3 61.8 41 78.3c-4.5 8-51.8 23.9-87.2 3.1z m51.4-137.9c0-40.9 38.3-73.9 47-73.9 8.9 0 47 33.1 47 73.9 0 40.9-28 73.9-47 73.9-9.4 0.2-47-33-47-73.9z" fill="#ffffff" p-id="11398"></path><path d="M935.9 525.9c-6.1 1.8-12.6 2.9-19.1 2.9 0 0-196.9 61.1-395.9 61.1-205.8 0-413.9-61.1-413.9-61.1-9.6 0-18.7-2-27.3-5.9 3.6-39.8 6.6-66.3 6.6-66.3 0-46.3 35.9-84.3 81.6-88.4 77.1 10.5 216.3 26.4 352.9 26.4 131 0 259.3-15 332.9-25.6 42.6 6.8 75.2 43.3 75.2 87.5 0.1 0.2 3.3 27.9 7 69.4z" fill="#ffffff" p-id="11399"></path><path d="M520.9 588.9c-3 0-6 0-9-0.1v-195h9c131 0 259.3-15 332.9-25.6 42.6 6.8 75.2 43.3 75.2 87.5 0 0 3.1 27.6 6.8 69.1-6.1 1.8-12.6 2.9-19.1 2.9 0 0.2-196.7 61.2-395.8 61.2z" fill="#ffffff" p-id="11400"></path><path d="M107.1 315.8s210 35.5 413.9 35.5c201 0 395.9-35.5 395.9-35.5 49.7 0 89.9 39.6 89.9 88.7v17.8c0 48.9-40.3 88.7-89.9 88.7 0 0-196.9 35.5-395.9 35.5-205.8 0-413.9-35.5-413.9-35.5-49.7 0-89.9-39.6-89.9-88.7v-17.8c-0.1-49 40.2-88.7 89.9-88.7z" fill="#ffffff" p-id="11401"></path><path d="M916.7 510.8s-196.9 35.5-395.9 35.5h-9V351.2h9c201 0 395.9-35.5 395.9-35.5 49.7 0 89.9 39.6 89.9 88.7v17.8c0.2 48.9-40.1 88.6-89.9 88.6z" fill="#ffffff" p-id="11402"></path><path d="M615 877.4c35.4-20.8 45.2-70.8 41-78.3-4.4-7.7-51.8-23.9-87.2-3.1s-50.3 61.8-41 78.3c4.6 8 51.8 23.9 87.2 3.1z m-103-64.5V667.2c13.4 7 42.4 36.8 42.4 72.4 0 37.6-23.8 68.5-42.4 73.3z" fill="#ffffff" p-id="11403"></path></svg>
                                <div>全球粮食短缺</div>
                                <div class="aa">1.3万亿斤</div>
                            </div>
                            <div class="ddq">
                              <svg t="1605335129147" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13207" width="32" height="32"><path d="M288.929172 656.013026Q264.475441 651.844776 243.147897 646.078697a169.091995 169.091995 0 0 1-41.682497-17.228765c-5.488195-3.126187-10.90692-6.321845-16.117232-9.586974a118.100407 118.100407 0 0 1-41.682496-46.892809 108.166079 108.166079 0 0 1-2.848304-83.781818 118.100407 118.100407 0 0 1 23.967435-38.834193 133.383989 133.383989 0 0 1 30.428223-24.453731 189.863772 189.863772 0 0 1 35.708005-16.117232l26.81574-8.336499c8.822795-2.778833 18.131886-5.557666 27.788331-8.3365 0.694708-4.862958 1.181004-9.656445 1.528358-14.31099a104.553596 104.553596 0 0 1 2.084125-14.310991c1.042062-5.90502 2.223066-11.74057 3.681954-17.437177a131.994573 131.994573 0 0 1 5.140841-16.950882 29.664043 29.664043 0 0 1 12.782632-16.395116 26.398915 26.398915 0 0 1 19.035007-2.848304 28.413569 28.413569 0 0 1 16.881411 9.864858 27.788331 27.788331 0 0 1 5.974491 19.799186c0 6.947083-0.903121 13.894166-1.806241 20.841248s-1.6673 13.894166-2.362008 20.841248v4.16825a31.609227 31.609227 0 0 1 0 4.654546c6.947083 2.084125 14.380461 3.959837 21.327544 5.488195a116.988874 116.988874 0 0 1 20.285481 6.530258c10.07327 3.820896 20.077069 7.850204 29.941927 12.226865a213.831208 213.831208 0 0 1 28.899864 15.353053 79.613569 79.613569 0 0 1 31.539756 34.735414 96.772863 96.772863 0 0 1 8.058616 46.614926 140.261601 140.261601 0 0 1-29.664043 82.809226 171.662415 171.662415 0 0 1-72.874898 49.949525 134.634464 134.634464 0 0 1-21.674899 6.530258c-7.433379 1.528358-15.353053 3.543012-23.689552 5.974491v29.038806a41.682497 41.682497 0 0 1 0 8.3365 20.841248 20.841248 0 0 1-21.049661 20.285481 21.744369 21.744369 0 0 1-22.925373-19.729715c-1.389417-6.252374-2.709362-12.504749-3.890366-18.757123s-2.50095-12.852103-3.820896-19.799186z m-6.947082-227.516961a116.085753 116.085753 0 0 0-34.735414 9.100679 145.888738 145.888738 0 0 0-31.192402 17.992944 104.623066 104.623066 0 0 0-32.790231 48.629579Q170.203528 549.305834 208.412483 575.843691a135.95441 135.95441 0 0 0 29.455631 15.839348 208.412483 208.412483 0 0 0 32.026052 9.656445 14.936228 14.936228 0 0 0 6.252374 0.76418h5.696608z m61.967978-7.850203q-3.681954 45.850746-4.724016 91.145726T338.878697 604.396201l19.035007-4.654546a147.76445 147.76445 0 0 0 17.228765-5.140841 175.483311 175.483311 0 0 0 37.514247-19.799186 97.259159 97.259159 0 0 0 28.621981-31.748168 69.470828 69.470828 0 0 0 7.780733-26.05156 100.663229 100.663229 0 0 0-1.042062-28.899865 83.364993 83.364993 0 0 0-9.586975-26.537856 59.536499 59.536499 0 0 0-17.437177-19.521302 145.888738 145.888738 0 0 0-35.430122-16.950882 109.833379 109.833379 0 0 0-41.474085-4.446133zM523.254274 524.296336a280.523202 280.523202 0 0 1 6.947083-58.980732 181.596744 181.596744 0 0 1 21.81384-53.145183 158.462958 158.462958 0 0 1 62.037449-60.022795 174.232836 174.232836 0 0 1 84.337585-17.854003 30.428223 30.428223 0 0 1 5.974491 0.486296c12.921574 2.987246 25.773677 5.627137 38.695251 7.989145a263.989145 263.989145 0 0 1 38.208955 9.864857 160.547083 160.547083 0 0 1 78.363094 55.090367 157.698779 157.698779 0 0 1 30.289281 91.284667 253.360109 253.360109 0 0 1-10.420625 81.350339 155.892537 155.892537 0 0 1-96.772863 103.719946A216.193216 216.193216 0 0 1 650.246947 694.013569a148.389688 148.389688 0 0 1-71.138127-35.499593 183.611398 183.611398 0 0 1-55.576663-134.21764z m176.664315 137.482768c5.627137-0.694708 11.184803-1.250475 16.81194-1.73677a109.624966 109.624966 0 0 0 16.881411-2.778833 184.097693 184.097693 0 0 0 64.538399-26.537856 123.519132 123.519132 0 0 0 43.62768-54.117775 188.196472 188.196472 0 0 0 15.90882-66.205699 141.095251 141.095251 0 0 0-14.380462-66.761465 128.868385 128.868385 0 0 0-30.080868-39.181547 190.211126 190.211126 0 0 0-44.878155-30.497694 180.624152 180.624152 0 0 0-52.311533-16.395115 116.502578 116.502578 0 0 0-52.8673 3.751425c-6.947083 2.292537-13.894166 4.724016-20.841248 6.947083a178.470556 178.470556 0 0 0-20.077069 8.683853A112.125916 112.125916 0 0 0 604.396201 388.61981a87.185889 87.185889 0 0 0-15.353053 16.117232A164.645862 164.645862 0 0 0 558.267571 472.401628a196.324559 196.324559 0 0 0 0.694709 74.194844 168.74464 168.74464 0 0 0 14.449932 42.377205A136.718589 136.718589 0 0 0 599.672185 625.237449 108.930258 108.930258 0 0 0 646.078697 653.02578a218.555224 218.555224 0 0 0 53.839892 8.753324z m-30.289281-131.508276q-6.947083-1.458887-14.380461-2.709363t-14.380462-2.709362a19.660244 19.660244 0 0 1-8.197557-3.473541 8.336499 8.336499 0 0 1-2.709363-7.989145 8.544912 8.544912 0 0 1 3.195658-7.641791 21.535957 21.535957 0 0 1 7.711262-3.265129c4.585075-1.319946 9.309091-2.570421 13.894166-3.681954l14.658345-3.751425c0.625237-8.892266 1.389417-17.992944 2.223066-27.302035s1.736771-18.826594 2.709362-28.760923h-27.788331a36.750068 36.750068 0 0 0-6.252374-0.486296 44.391859 44.391859 0 0 1-6.947083-0.486295 15.97829 15.97829 0 0 1-6.947083-2.50095 6.947083 6.947083 0 0 1-2.987245-5.974491 17.159294 17.159294 0 0 1 2.223066-5.905021 17.64559 17.64559 0 0 1 4.237721-5.001899 34.735414 34.735414 0 0 1 11.879511-4.932429 267.115332 267.115332 0 0 1 42.932972-6.460787q21.535957-1.458887 43.905563-1.458888h11.393215a56.340841 56.340841 0 0 1 11.462687 1.736771 32.859701 32.859701 0 0 1 15.353053 8.475441 13.268928 13.268928 0 0 1 3.473541 6.391316 11.184803 11.184803 0 0 1 0 6.460787 15.700407 15.700407 0 0 1-3.959837 5.210312 17.715061 17.715061 0 0 1-5.974491 3.751425 42.099322 42.099322 0 0 1-9.656445 0.764179H701.65536c2.014654 9.586974 3.890366 18.618182 5.696607 27.024152s3.543012 16.950882 5.210313 25.565265h20.841248a14.588874 14.588874 0 0 1 16.395115 11.879511 14.866757 14.866757 0 0 1-0.764179 10.420624A14.310991 14.310991 0 0 1 740.559023 521.031208c-4.585075 1.6673-9.309091 3.195658-13.894165 4.515603s-9.864858 2.778833-15.144641 4.446133v42.168793H722.496608c2.639891 0 5.210312 0.555767 7.711262 0.764179a25.078969 25.078969 0 0 1 7.711262 1.736771 31.470285 31.470285 0 0 1 5.210312 2.709362q2.709362 1.806242 2.709362 3.751425a10.490095 10.490095 0 0 1-1.736771 5.210312 12.782632 12.782632 0 0 1-4.23772 4.168249 16.117232 16.117232 0 0 1-5.974491 2.987246c-2.292537 0.694708-4.793487 1.319946-7.433379 2.014654q-22.300136 3.959837-44.600271 5.696608a219.180461 219.180461 0 0 1-45.642334-1.250475 40.987788 40.987788 0 0 1-6.947083-2.223067c-2.014654-0.83365-2.987246-2.917775-2.987245-6.182903a5.696608 5.696608 0 0 1 2.709362-5.488196 30.497693 30.497693 0 0 1 6.947083-2.500949l14.380461-2.987246c5.0019-0.972592 9.795387-2.084125 14.449932-3.473541a8.128087 8.128087 0 0 0 3.195658-2.223067 4.654545 4.654545 0 0 0 1.736771-3.195658c0-6.947083 0.416825-13.894166 0-20.841248s-0.069471-13.963636-0.069471-20.563365zM810.029851 576.60787a13.199457 13.199457 0 0 1-5.696608 9.934328 9.23962 9.23962 0 0 1-10.142741 0 71.485482 71.485482 0 0 1-6.460787-4.932429l-5.974491-5.001899q-11.879512-9.864858-22.855902-19.799186a19.243419 19.243419 0 0 1-5.418725-5.974491 7.641791 7.641791 0 0 1 0.486296-7.919675 10.142741 10.142741 0 0 1 6.947083-5.001899 12.157395 12.157395 0 0 1 7.919674 2.014654c6.321845 3.612483 12.365807 7.433379 18.131886 11.393215s11.462687 8.128087 17.089824 12.435279a13.129986 13.129986 0 0 1 3.473541 5.90502 63.843691 63.843691 0 0 0 2.50095 6.947083z" p-id="13208" fill="#ffffff"></path><path d="M512 1024a512 512 0 1 1 512-512 512.555767 512.555767 0 0 1-512 512z m0-942.302307a430.302307 430.302307 0 1 0 430.302307 430.302307A430.719132 430.719132 0 0 0 512 81.697693z" p-id="13209" fill="#ffffff"></path><path d="M885.405699 778.07327a96.217096 96.217096 0 0 0-33.137585-33.901764 95.244505 95.244505 0 0 0-49.671642-13.894165 95.66133 95.66133 0 0 0-82.809226 47.795929 72.110719 72.110719 0 0 1-125.04749 0 96.217096 96.217096 0 0 0-33.137585-33.901764 94.966621 94.966621 0 0 0-49.602171-13.894165A95.66133 95.66133 0 0 0 429.190773 778.07327a72.18019 72.18019 0 0 1-125.047489 0 96.217096 96.217096 0 0 0-33.207056-33.762822 95.175034 95.175034 0 0 0-49.602171-13.894166 95.175034 95.175034 0 0 0-49.602171 13.894166A96.217096 96.217096 0 0 0 138.941655 778.07327a72.527544 72.527544 0 0 1-34.735413 30.497693 598.908005 598.908005 0 0 0 47.240162 40.640435 89.408955 89.408955 0 0 0 8.197558-12.018454 72.041248 72.041248 0 0 1 124.283311 0 95.66133 95.66133 0 0 0 166.313161 0 72.110719 72.110719 0 0 1 124.352782 0 96.286567 96.286567 0 0 0 33.55441 34.735414 95.66133 95.66133 0 0 0 132.758751-34.735414 72.805427 72.805427 0 0 1 62.523745-35.569063 72.458073 72.458073 0 0 1 62.523745 35.499593 95.591859 95.591859 0 0 0 8.197558 11.948982 584.735957 584.735957 0 0 0 47.240163-40.640434 72.388602 72.388602 0 0 1-35.985889-30.358752z" p-id="13210" fill="#ffffff"></path></svg>
                                <div>中国进口粮食</div>
                                <div class="aa">13062万斤</div>
                            </div>
                        </div>
                        <div class="yx"><div class="su"></div>2020年各省粮食短缺量</div>
                        <div class="rowl" id="rowl">
                            <div id="main1" style="width: 600px;height:400px;"></div>
                        </div>
                    </div>

                    <div class="box1">
                        <div class="divleft">
                            <div class="rowl2">
                                <div class="yx"><div class="su"></div>桑芽菜各月销售情况</div>
                                <div id="main2" style="width: 600px;height:400px;"></div>
                            </div>
                            <div class="rowl2">
                                <div class="yx"><div class="su"></div>近一周桑芽菜热门产品销售金额(元)</div>
                                <div id="main3" style="width: 600px;height:400px;"></div>
                            </div>
                        </div>
                    </div>

                    <div class="box2">
                        <div class="divleft">
                            <div class="rowl2">
                                <div class="yx"><div class="su"></div>桑芽菜各品种进货情况分析</div>
                                <div id="main4" style="width: 600px;height:400px;"></div>
                            </div>
                            <div class="rowl2">
                                <div class="yx"><div class="su"></div>桑芽菜各品种销售情况(元)</div>
                                <div id="main6" style="width: 600px;height:400px;"></div>
                            </div>
                           
                        </div>
                    </div>

                    <div class="box3">
                        <div class="divleft">
                            <div class="rowl2">
                                <div class="yxdz"><div class="su"></div>桑芽菜库存情况</div>
                                <div id="main5" style="width: 600px;height:400px;"></div>
                            </div>
                            <div class="rowl2">
                                <div class="yxdz"><div class="su"></div>消费桑芽菜主要城市</div>
                                <div id="main7" style="width: 600px;height:400px;"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /Page Body -->
            </div>
            <!-- /Page Content -->
        </div>
    </div>

    <!--Basic Scripts-->
    <script src="__admin__/style/jquery_002.js"></script>
    <script src="__admin__/style/bootstrap.js"></script>
    <script src="__admin__/style/jquery.js"></script>
    <!--Beyond Scripts-->
    <script src="__admin__/style/beyond.js"></script>
    <script src="__admin__/style/js/echarts.min.js"></script>
    <!-- ok 0 -->
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));

    // 指定图表的配置项和数据
    var option = {
        title: {
            text: '',
            subtext: '',
            left: 'center'
        },
        tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b} : {c} ({d}%)'
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            data: ['耕地', '林地', '牧草地', '其他农用地', '园林']
        },
        series: [
            {
                name: '访问来源',
                type: 'pie',
                radius: '65%',
                center: ['66%', '55%'],
                data: [
                    {value: 435, name: '耕地'},
                    {value: 1010, name: '林地'},
                    {value: 600, name: '牧草地'},
                    {value: 135, name: '其他农用地'},
                    {value: 148, name: '园林'}
                ],
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
    </script>
    <!-- ok 1-->
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart1 = echarts.init(document.getElementById('main1'));

        // 指定图表的配置项和数据

    var  option = {
    dataset: {
        source: [
            ['score', 'amount', 'product'],
            [89.3, 78212, '北京'],
            [57.1, 65254, '广东省'],
            [74.4, 51032, '上海市'],
            [50.1, 32755, '贵州省'],
            [89.7, 20145, '云南省'],
            [68.1, 19146, '陕西省'],
            [19.6, 14852, '甘肃省'],
            [10.6, 12852, '江西省'],
            [32.7, 10112, '江苏省']
        ]
    },
    grid: {containLabel: true},
    xAxis: {name: '(千公顷)'},
    yAxis: {type: 'category'},
    visualMap: {
        orient: 'horizontal',
        left: 'center',
        min: 10,
        max: 100,
        text: ['高', '低'],
        // Map the score column to color
        dimension: 0,
        inRange: {
            color: ['#D7DA8B', '#E15457']
        }
    },
    series: [
        {
            type: 'bar',
            encode: {
                // Map the "amount" column to X axis.
                x: 'amount',
                // Map the "product" column to Y axis
                y: 'product'
            }
        }
    ]
    };



    myChart1.setOption(option);


    </script>
    <!-- ok 2 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart2 = echarts.init(document.getElementById('main2'));

// 指定图表的配置项和数据
var option = {
xAxis: {
    type: 'category',
    data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
},
yAxis: {
    type: 'value'
},
series: [{
    data: [4714, 3754, 4213, 4292, 4265, 3622, 5547, 3757, 4216, 4294, 4256, 3632],
    type: 'line'
}]
};


// 使用刚指定的配置项和数据显示图表。
myChart2.setOption(option);

    </script>
    <!-- ok 3 -->
     <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart3 = echarts.init(document.getElementById('main3'));

    // 指定图表的配置项和数据
    var option = {
        title: {
            text: ''
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['贡桔蛋糕', '桑芽糍粑', '桑芽曲奇', '桑芽馒头', '桑芽酸奶']
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期七']
        },
        yAxis: {
            type: 'value'
        },
        series: [
            {
                name: '贡桔蛋糕',
                type: 'line',
                stack: '总量',
                data: [12000, 13010, 14001, 15304, 50090, 40030, 40210]
            },
            {
                name: '桑芽糍粑',
                type: 'line',
                stack: '总量',
                data: [22000, 33010, 24001, 14304, 50090, 50030, 40210]
            },
            {
                name: '桑芽曲奇',
                type: 'line',
                stack: '总量',
                data:[1200, 13010, 14001, 15304, 50090, 50030, 40210]
            },
            {
                name: '桑芽馒头',
                type: 'line',
                stack: '总量',
                data: [32000, 53010, 34001, 5304, 20090, 42030, 45210]
            },
            {
                name: '桑芽酸奶',
                type: 'line',
                stack: '总量',
                data: [21000, 43010, 4001, 25304, 10090, 45030, 48210]
            }
        ]
    };



    // 使用刚指定的配置项和数据显示图表。
    myChart3.setOption(option);

    </script>
    <!-- ok 4-->
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart4 = echarts.init(document.getElementById('main4'));

    // 指定图表的配置项和数据
    var option = {
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'cross',
            crossStyle: {
                color: '#999'
            }
        }
    },
    toolbox: {
        feature: {
        }
    },
    legend: {
        data: ['进货量', '增长%']
    },
    xAxis: [
        {
            type: 'category',
            data: ['贡桔蛋糕', '桑芽糍粑', '桑芽曲奇', '桑芽馒头', '桑芽酸奶', '凤梨酥', '桑芽杆酒'],
            axisPointer: {
                type: 'shadow'
            }
        }
//         贡桔蛋糕'},
// 桑芽糍粑'},
// 桑芽馒头'},
// 桑芽曲奇'},
// 桑芽酸奶'},
// 桑芽杆酒'},
// '桑芽凤梨酥
    ],
    yAxis: [
        {
            type: 'value',
            name: '进货金额',
            min: 0,
            max: 700,
            interval: 50,
            axisLabel: {
                formatter: '{value} '
            }
        },
        {
            type: 'value',
            name: '增长%',
            min: 0,
            max: 14.00,
            interval: 5,
            axisLabel: {
                formatter: '{value} %'
            }
        }
    ],
    series: [
        {
            name: '单产：公斤/亩',
            type: 'bar',
            data: [471, 375, 421, 129, 426, 362, 557]
        },
        {
            name: '增长%',
            type: 'line',
            yAxisIndex: 1,
            data: [1.0, 3.9, 3.5, 2.4, 11.3, 13.5, 1.2]
        }
    ]
};


    // 使用刚指定的配置项和数据显示图表。
    myChart4.setOption(option);

    </script>
    <!-- ok 5 -->
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart5 = echarts.init(document.getElementById('main5'));

    // 指定图表的配置项和数据
    var option = {
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b}: {c} ({d}%)'
    },
    legend: {
        // orient: 'vertical',
        left: 0,
        // data: ['稻谷', '小麦', '玉米', '大豆', '豆类', '花生', '薯类']
    },
    series: [
        {
            name: '访问来源',
            type: 'pie',
            radius: ['50%', '70%'],
            avoidLabelOverlap: false,
            label: {
                show: false,
                position: 'center'
            },
            emphasis: {
                label: {
                    show: true,
                    fontSize: '30',
                    fontWeight: 'bold'
                }
            },
            labelLine: {
                show: false
            },
            data: [
                {value: 335, name: '贡桔蛋糕'},
                {value: 310, name: '桑芽糍粑'},
                {value: 234, name: '桑芽馒头'},
                {value: 135, name: '桑芽曲奇'},
                {value: 234, name: '桑芽酸奶'},
                {value: 135, name: '桑芽杆酒'},
                {value: 1548, name: '桑芽凤梨酥'}
            ]
        }
    ]
};



    // 使用刚指定的配置项和数据显示图表。
    myChart5.setOption(option);

    </script>
    <!-- ok 6 -->
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart6 = echarts.init(document.getElementById('main6'));

    // 指定图表的配置项和数据
    var option = {
    xAxis: {
        type: 'category',
        data: ['贡桔蛋糕', '桑芽糍粑', '桑芽曲奇', '桑芽馒头', '桑芽酸奶', '凤梨酥', '桑芽杆酒']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [5591, 4891, 3191, 1391, 2391, 1191, 2691],
        type: 'bar'
    }]
};

    // 使用刚指定的配置项和数据显示图表。
    myChart6.setOption(option);

    </script>
    <!-- ok 7 -->
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart7 = echarts.init(document.getElementById('main7'));

    // 指定图表的配置项和数据
    var option = {
        tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b}: {c} ({d}%)'
        },
        legend: {
            // orient: 'vertical',
            left: 10,
            data: ['北京', '上海', '广州', '深圳']
        },
        series: [
            {
                name: '访问来源',
                type: 'pie',
                radius: ['50%', '70%'],
                avoidLabelOverlap: false,
                label: {
                    show: false,
                    position: 'center'
                },
                emphasis: {
                    label: {
                        show: true,
                        fontSize: '30',
                        fontWeight: 'bold'
                    }
                },
                labelLine: {
                    show: false
                },
                data: [
                    {value: 335, name: '北京'},
                    {value: 310, name: '上海'},
                    {value: 234, name: '广州'},
                    {value: 335, name: '深圳'},
                ]
            }
        ]
    };


    // 使用刚指定的配置项和数据显示图表。
    myChart7.setOption(option);

    </script>
    <!-- ok 8 -->
    <script type="text/javascript"> 
    // 基于准备好的dom，初始化echarts实例
    var myChart8 = echarts.init(document.getElementById('main8'));

// 指定图表的配置项和数据
var option = {
    xAxis: {
        type: 'category',
        data: ['玉米', '蔬菜', '水果', '油料', '粮食', '元麦', '元麦']
    },
    
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [820, 932, 901, 934, 1290, 1330, 1320],
        type: 'line'
    }]
};



// 使用刚指定的配置项和数据显示图表。
myChart8.setOption(option);


    </script>
    <!-- ok 9 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart9 = echarts.init(document.getElementById('main9'));

// 指定图表的配置项和数据
var option = {
    title: {
        text: '用户访问来源',
        subtext: '',
        left: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b} : {c} ({d}%)'
    },
    // legend: {
    //     orient: 'vertical',
    //     left: 'left',
    //     data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
    // },
    series: [
        {
            name: '访问来源',
            type: 'pie',
            radius: '40%',
            center: ['20%', '50%'],
            data: [
                {value: 335, name: '直接访问'},
                {value: 310, name: '邮件营销'},
                {value: 234, name: '联盟广告'},
                {value: 135, name: '视频广告'},
                {value: 1548, name: '搜索引擎'}
            ],
            emphasis: {
                itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};

// 使用刚指定的配置项和数据显示图表。
myChart9.setOption(option);


    </script>
    <!-- ok 10 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart10 = echarts.init(document.getElementById('main10'));

// 指定图表的配置项和数据
var option = {
    title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: ['上周购买人数', '本周购买人数']
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
    },
    yAxis: {
        type: 'value'
    },
    series: [
        {
            name: '上周购买人数',
            type: 'line',
            stack: '总量',
            data: [120, 132, 101, 134, 90, 230, 210]
        },
        {
            name: '本周购买人数',
            type: 'line',
            stack: '总量',
            data: [220, 182, 191, 234, 290, 330, 310]
        }
    ]
};

// 使用刚指定的配置项和数据显示图表。
myChart10.setOption(option);


    </script>
    <!-- ok 11 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart11 = echarts.init(document.getElementById('main11'));


// 指定图表的配置项和数据
var option = {
    title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis'
    },
    // legend: {
    //     data: ['邮件营销', '联盟广告', '视频广告', '直接访问', '搜索引擎']
    // },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    // toolbox: {
    //     feature: {
    //         saveAsImage: {}
    //     }
    // },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ['0', '2', '4', '6', '8', '10', '12','14', '16', '18', '20', '22', '24']
    },
    yAxis: {
        type: 'value'
    },
    series: [
        {
            name: '邮件营销',
            type: 'line',
            stack: '总量',
            data: [120, 132, 101, 134, 90, 230, 210,120, 132, 101, 134,145,154]
        }
    ]
};


// 使用刚指定的配置项和数据显示图表。
myChart11.setOption(option);


    </script>
    <!-- ok 12 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart12 = echarts.init(document.getElementById('main12'));


// 指定图表的配置项和数据
var option = {
    title: {
        text: '',
        subtext: '',
        left: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter: '{a} <br/>{b} : {c} ({d}%)'
    },
    // legend: {
    //     orient: 'vertical',
    //     left: 'left',
    //     data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
    // },
    series: [
        {
            name: '访问来源',
            type: 'pie',
            radius: '55%',
            center: ['50%', '50%'],
            data: [
                {value: 335, name: ',水果'},
                {value: 310, name: '苹果'},
                {value: 234, name: '蔬菜'},
                {value: 135, name: '青菜'},
                {value: 548, name: '牛奶'}
            ],
            emphasis: {
                itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};

// 使用刚指定的配置项和数据显示图表。
myChart12.setOption(option);


    </script>
    <!-- ok 13 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart13 = echarts.init(document.getElementById('main13'));

// 指定图表的配置项和数据
var option = {
    title: {
        text: ''
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: ['上月收入', '本月收入']
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
    },
    yAxis: {
        type: 'value'
    },
    series: [
        {
            name: '上月收入',
            type: 'line',
            stack: '总量',
            data: [120, 132, 101, 134, 90, 230, 210, 101, 134, 90, 230, 210]
        },
        {
            name: '本月收入',
            type: 'line',
            stack: '总量',
            data: [220, 182, 191, 234, 290, 330, 310, 191, 234, 290, 330, 310]
        }
    ]
};

// 使用刚指定的配置项和数据显示图表。
myChart13.setOption(option);


    </script>
    <!-- ok 14 -->
    <script type="text/javascript">
    // 基于准备好的dom，初始化echarts实例
    var myChart14 = echarts.init(document.getElementById('main14'));

// 指定图表的配置项和数据
var option = {
    title: {
        text: ''
    },
    tooltip: {},
    legend: {
        data: ['平均价', '市场平均价']
    },
    radar: {
        // shape: 'circle',
        name: {
            textStyle: {
                color: '#fff',
                backgroundColor: '#999',
                borderRadius: 3,
                padding: [3, 10]
            }
        },
        indicator: [
            { name: '质量', max: 6500},
            { name: '价格', max: 16000},
            { name: '安全', max: 30000},
            { name: '服务', max: 38000},
            { name: '售后', max: 52000},
            { name: '环保', max: 25000}
        ]
    },
    series: [{
        name: '预算 vs 开销（Budget vs spending）',
        type: 'radar',
        // areaStyle: {normal: {}},
        data: [
            {
                value: [4300, 10000, 28000, 35000, 50000, 19000],
                name: '平均价'
            },
            {
                value: [5000, 14000, 28000, 31000, 42000, 21000],
                name: '市场平均价'
            }
        ]
    }]
};

// 使用刚指定的配置项和数据显示图表。
myChart14.setOption(option);


    </script>








</body>

</html>